@media(max-width:1200px){
    .cards-wrapper{
        flex-direction: column;
        align-items: center;
    }

    .card{
        margin: 3rem 0;
    }

    .story-bg{
        width: 85%;
    }
}

@media(max-width:1000px){
    .nav-list{
        flex-direction: column;
    }
    .nav-link{
        flex-grow: 1;
    }

    .header-text{
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        z-index: 10;
    }

    .heading{
        font-size: 6rem;
    }

    .header-paragraph{
        font-size: 2.5rem;
    }

    .popular-tour-heading{
        font-size: 6rem;
    }

    .story-bg{
        transform: skew(0);
    }

    .story{
        transform: skewX(0);
        flex-direction: column;
        align-items: center;
    }

    .story img{
        margin-bottom: 3rem;
    }

    .footer-link{
        padding: 0.3rem 2rem;
        margin: 0 1rem;
    }
}

@media(max-width:800px){
    .header-paragraph{
        display: none;
    }

    .popular-tour-heading{
        font-size: 5rem;
    }
    .contact-form{
        width: 90%;
    }

    .footer-list{
        flex-direction: column;
        align-items: center;
    }

    .footer-link{
        margin: 1rem 0;
    }
}

@media(max-width:650px){
    .container{
        margin: 0;
    }

    .open-navbar-icon{
        left: 2.5rem;
        top: 2.5rem;
    }

    .navbar-wrapper{
        padding: 0;
    }

    .close-navbar-icon{
        right: 4rem;
    }

    .contact-heading{
        font-size: 6rem;
    }

    .contact-form{
        padding: 2rem;
        height: 40rem;
    }
}

@media(max-width:500px){
    html{
        font-size: 45%;
    }
}